<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <title></title>
    <#include "/inc/head.ftl"/>
    <@head/>
</head>

<body>
    <div class="panel panel-default">
        <div class="panel-body">
            <div class="row">
                <form id="form" action="${contextPath}/commodity/updateCommodity" role="form" method="post">
                    <div class="col-lg-12">
                        <input id="id" name="commodity.id" type="hidden" value="${(commodity.id)!}" class="form-control">
                        <div class="form-group">
                            <label>商品名</label>
                            <input id="commodityName" name="commodity.commodityName" value="${(commodity.commodityName)!}" class="form-control">
                        </div>

                        <div class="form-group">
                            <label>库存数量</label><span id="tips"></span>
                            <input id="commodityQty" name="commodity.commodityQty" value="${(commodity.commodityQty)!}" class="form-control" onfocus="this.select();" autofocus>
                        </div>

                        <div class="col-xs-9">
                            <div class="form-group">
                                <label>变更数量</label>
                                <input id="newQty" type="text" class="form-control" onfocus="totalIncrement()">
                            </div>
                        </div>

                        <label>变更操作</label>
                        <div class="form-group">
                            <button class="btn btn-default" type="button" id="btn-plus" value="+" onclick="plusOrMinus($(this).val())">+</button>
                            <button class="btn btn-default" type="button" id="btn-minus" value="-" onclick="plusOrMinus($(this).val())">-</button>
                        </div>

                        <div align="right">
                            <button id="btn-submit" type="submit" class="btn btn-default">提交</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        <!-- /.panel-body -->
    </div>
    <!-- /.panel -->i
    <script>
        $(function() {
            $('form').validate({
                submitHandler: function(form) {
                    $(form).ajaxSubmit(function(data) {
                        if (data.result) {
                            parent.layer.msg(data.msg, {
                                time: 1000,
                                icon: 1
                            });
                        } else {
                            parent.layer.msg(data.msg, {
                                time: 1000,
                                icon: 2
                            });
                        }
                        var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
                        parent.layer.close(index);
                    });
                }
            });
        });

        function plusOrMinus(value) {
            var newQty = $('#newQty').val();
            if(value=='+') $('#commodityQty').val(($('#commodityQty').val() - 0) + ((newQty=='')?1:(newQty - 0)));
            else $('#commodityQty').val(($('#commodityQty').val() - 0) - ((newQty=='')?1:(newQty - 0)));
            $('#newQty').select();
        }

        function totalIncrement() {
            var qty = '${(commodity.commodityQty)!}'-0;
            var newQty = $("#commodityQty").val()-0;
            var totalIncrement = newQty - qty;
            if(totalIncrement < 0){
                $("#tips").html('-' + totalIncrement);
                $("#tips").css("color","red");

            }else {
                $("#tips").html('+' + totalIncrement);
                $("#tips").css("color","green")
            }
        }

    </script>
</body>

</html>